var User = angular.module('user', ['ngDragDrop']);
var avatar = {};
avatar.img = {};

User.controller('profileController', function($scope) {
   for (i in widgets) {
       $cmd = '$scope.widget_item_'+widgets[i].id+'={title:"'+widgets[i].name+'"};';
       eval($cmd);
       $cmd = '$scope.widget_profile_'+widgets[i].id+'={};';
       eval($cmd);
   }

   $scope.changeAvatar = function() {
       $('#user_avatar_donebt').addClass('disabled');
       send('changeAvatar', avatar.img, function(result) {
           console.log(result);
           $('#user_avatar_donebt').removeClass('disabled');
           $('#changeAvatar').modal('hide');
       });
   }
});

$(document).ready(function() {
    // SORTABLE WIDGET & PROFILE BLOCK
    $("#block_sortable").sortable();
    $("#widget_sortable").sortable();
    $("#social_icon_sortable").sortable();

    $('.user_widget_block').css({
        'display':'none'
    });

    $('.user_widget_block').hover(function(){
        $(this).find('.user_block_close').css({'display':'block'});
    }, function(){
        $(this).find('.user_block_close').css({'display':'none'});
    });

    $('.user_avatar_area').hover(function() {
        $('.user_avatar').css({
            opacity: 0.3,
            filter: 'alpha(opacity=30)',
            zoom: 1
        });
        $(this).css({
            cursor:'pointer'
        })
        $('.user_change_avatar_icon img').css({
            opacity:1,
            filter: 'alpha(opacity=100)',
            zoom: 1,
            cursor:'pointer',
            'z-index':999
        });
    }, function() {
        $('.user_avatar').css({
            opacity:1,
            filter: 'alpha(opacity=100)'
        });
        $('.user_change_avatar_icon img').css({
            opacity:0.3,
            filter: 'alpha(opacity=30)',
            zoom: 1,
            cursor:'',
            'z-index':0
        });
    });

    function hoverMenu(parent, target, tabcontent) {

        $(target).click(function() {

            $('.index_menu_area').fadeOut();
            $('.index_notify_icon,.index_account_avatar').css('background','#1ab7f2');

            $(tabcontent).toggle();

            if ($(tabcontent).is(':hidden')) {
                $(target).css({background: '#1ab7f2'});
            } else {
                $(target).css({background: '#17a4d9'});
            }
        });

        /*
        $(parent).mouseleave(function() {
            $(target).css({background: '#1ab7f2'});
            $(tabcontent).toggle();
        });*/
    }

	// ??????????????????????????????????????????????????????????
    $('.index, .profile').click(function() {
        $('.index_menu_area').fadeOut();
        $('.index_notify_icon,.index_account_avatar').css('background','#1ab7f2');
    });

    // ??????????????????????????????????????????????????????????
    hoverMenu('.index_account','.index_account_avatar', '.index_setting_area' );

    // Connection menu
    hoverMenu('.index_notice_connection','.index_notice_connection', '.index_area_connection' );

    // Message menu
    hoverMenu('.index_notice_message','.index_notice_message', '.index_area_message' );

    // Status menu
    hoverMenu('.index_notice_status','.index_notice_status', '.index_area_status' );

    // Status menu
    hoverMenu('.index_option_setting','.index_option_setting', '.index_area_setting' );

    // Menu
	// ?????????????????????????????????????????????????
    $('.index_area_setting li').click(function() {
        var href = $(this).find('a').attr('href');
        window.location.href = href;
    });


    $('.index_notify_icon,.index_account_avatar').hover(function() {
        if ($(this).css('background-color')=='rgb(23, 164, 217)') return;
        $(this).css({
            'background':'#30bef3'
        });
    }, function() {
        if ($(this).css('background-color')=='rgb(23, 164, 217)') return;
        $(this).css({
            'background':'#1ab7f2'
        });
    });

    $('#user_upload_avatar').click(function() {
        $('.user_upload_avatar input').click();
    });

    $('.user_upload_avatar input').change(function(e){
        var loading = '<img style="margin-top:45%;width:60px" alt="Please wait ..." class="loading_small" src="'+app.root+'/img/app/app/loading.gif">';

        $('#user_avatar_background').css({
            'background':'aliceblue'
        });

        $('.profile_orignal_avatar').html(loading);
    });

    function min(x,y) {
        return x<y?x:y;
    }

    function max(x,y) {
        return x>y?x:y;
    }

    setTimeout(function() {
        avatar.square = 400;
        avatar.maxint = 9999999;
        avatar.width_org = $('#original_avatar')[0].naturalWidth;
        avatar.height_org = $('#original_avatar')[0].naturalHeight;
        avatar.max_square = max(avatar.width_org, avatar.height_org);
        avatar.ratio = avatar.square/avatar.max_square;
        avatar.width = Math.floor(avatar.width_org*avatar.ratio);
        avatar.height = Math.floor(avatar.height_org*avatar.ratio);
        avatar.size = min(avatar.width, avatar.height);
        avatar.change = function(img) {
            avatar.img.x = Math.floor(img.x);
            avatar.img.y = Math.floor(img.y);
            avatar.img.s = Math.floor(img.w);
        };

        $('#original_avatar').css({
            width:avatar.width,
            height:avatar.height
        });

        // DROP IMAGE
        $('#original_avatar').Jcrop({
            boxWidth:avatar.width,
            boxHeight:avatar.height,
            onChange: avatar.change
        },function() {
             avatar.api = this;
             avatar.api.setOptions({
                keySupport:false,
                aspectRatio: 1/1,
                minSize: [ 100, 100 ]
             });

             avatar.api.focus();
             avatar.img.x = Math.floor((avatar.width-avatar.size)/2);
             avatar.img.y = Math.floor((avatar.height-avatar.size)/2);
             avatar.img.s = avatar.maxint;

             console.log(avatar.img);
             avatar.api.setSelect([avatar.img.x, avatar.img.y, avatar.img.s,avatar.img.s]);
        });
    }, 500);
});